<template>
  <div class="box">
    <header class="header">
      <van-search v-model="value" show-action label="地址" placeholder="请输入搜索关键词" @search="onSearch">
        <template #action>
          <div @click="onClickButton">搜索</div>
        </template>
      </van-search>

    </header>
    <main class="content">
      <van-swipe :autoplay="3000" lazy-render>
  <van-swipe-item v-for="image in images" :key="image">
    <img :src="image" style="width: 100%;height: 200px;" />
  </van-swipe-item>
</van-swipe>
<van-grid>
  <van-grid-item icon="https://img20.360buyimg.com/babel/jfs/t20270715/36751/25/21385/7651/6694ee02F878cddef/13ce837dd39ad1ad.png" text="文字" />
  <van-grid-item icon="photo-o" text="文字" />
  <van-grid-item icon="photo-o" text="文字" />
  <van-grid-item icon="photo-o" text="文字" />
</van-grid>
    </main>
  </div>
</template>

<script setup>
const images = [
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
      'https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg',
      require("@/assets/logo.png")
    ];
</script>

<style lang="scss" scoped>

</style>